<template>
	<view>
		<block v-if="value">
			<view class="space-between padding-tb-sm solid-bottom margin-lr"  @tap="goDetail">
				<view class="thumb">
					<image :src="value.thumb" mode="aspectFill"></image>
				</view>
				<view class="info w100 margin-left-sm overflow">
					<view class="title text-black text-overflow-2">{{value.title}}</view>
					<view class="time flex flex-start text-gray ">
						<image :src="CLOUDPATH+'/college/icon-time.png'" mode="aspectFit" class="iconp"></image>
						<text> {{$common.timeFormat(value.start_time)}}</text>
					</view>
					<view class="time flex flex-start text-gray  align-center">
						<image :src="CLOUDPATH+'/college/icon-address.png'" mode="aspectFit" class="iconp"></image>
						<text class="address"> {{value.address?value.address:'暂无'}}</text>
					</view>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	export default {
		props: {
			value: {
				type: Object,
				default: null
			},
			stype: {
				type: String,
				default: 'one'
			}
		},
		created: function(e) {
			console.log(this.value)
		},
		data() {
			return {
				CLOUDPATH: this.$config.cloudPath,
				}
		},
		methods: {
			goDetail() {
				uni.navigateTo({
					url: '/collegePackages/pages/college/course/detail?id=' + this.value.id
				})
			},
		},
	}
</script>

<style>

	.thumb{
		width: 260rpx;
		height: 180rpx;
		min-width: 260rpx;
		overflow: hidden;
	}
	.thumb image{
		width: 100%;
		height: 100%;
	}
	.thumb .mark{
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: rgb(0,0,0,0.5);
		left: 0;
		top: 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.thumb .playbtn{
		width: 80rpx;
		height: 80rpx;
	}
	.title{
		height: 88rpx;
		line-height: 44rpx;
		overflow: hidden;
	}
	.teacher{
		margin: 14rpx 0;
	}
	.iconp{
		width: 30rpx;
		height: 30rpx;
	}
	.time{
		margin-top: 8rpx;
	}
</style>
